<template>
  <div>
    <div v-if="dataset.length != 0">
      当前数据被其他用户使用，请指定数据新的管理者
    </div>
    <a-select
      v-if="dataset.length != 0"
      class="select"
      placeholder="请选择新的数据管理者"
      :value="userId"
      @change="changeTransferUserId"
      ><a-select-option
        v-for="user in dataset"
        :key="user.userId"
        :value="user.userId"
        >{{ user.userName }}</a-select-option
      >
    </a-select>
  </div>
</template>

<script lang="ts">
import { Component, Vue, Prop, Watch } from 'vue-property-decorator'

@Component
export default class DeleteDatasetContent extends Vue {
  @Prop() dataset!: any
  @Prop() setTransferUserId!: any
  public userId: any = this.dataset.length === 0 ? -1 : this.dataset[0].userId
  @Watch('dataset')
  onChange(newValue: any) {
    this.userId = newValue[0].userId
  }
  private changeTransferUserId(value: any) {
    this.setTransferUserId(value)
    this.userId = value
  }
}
</script>

<style lang="less" scoped>
.select {
  padding: 10px;
  width: 80%;
}
</style>
